<style lang=sass>
@import "../../assets/sass/message/message.scss";
</style>

<template>
  <div class="vue-message vue-message-center" v-bind:class="className"  :transition="transition" v-show="visible">
    <div class="vue-message-header">{{{title}}}</div>
    <div class="vue-message-body">{{{content}}}</div>
    <div class="vue-message-footer">
    <div class="vue-message-btn" :class="className" @click="ok">{{button.text}}</div>
    </div>
  </div>
  <Mask v-show="visible"></Mask>
</template>

<script>
import Mask from "../mask/mask"

export default {
  props:{//继承父级组件参数
    title:String,
    content:String,
    className:String,
    button:{
        type:Object,
        default:{
          text:"确定",
          className:null
        }
    },
    transition:String,
    visible:Boolean
  },
  components:{
    Mask//依赖组件Mask
  },
  methods:{
    ok(){
      this.$emit("ok");
    }
  }
}
</script>


